<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>欢迎页面-X-admin2.0</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="__PUBLIC__/css/font.css">
    <link rel="stylesheet" href="__PUBLIC__/css/xadmin.css">
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="__PUBLIC__/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="__PUBLIC__/js/xadmin.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>
<div class="x-body">


    <form class="layui-form">
        <div class="layui-form-item">
            <label for="nickname" class="layui-form-label">
                <span class="x-red">*</span>昵称
            </label>
            <div class="layui-input-inline">
                <input type="text" id="nickname" name="nickname" required="" lay-verify="nickname"
                       autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">
                    最少两个字符
                </span>
            </div>
        </div>

        <div class="layui-form-item">
            <label for="nickname" class="layui-form-label">
                图片地址
            </label>
            <div class="layui-input-inline">
                <input type="text" id="nick_path" name="nick_path" required=""                        autocomplete="off" class="layui-input">
            </div>
            
        </div>


        <div class="layui-form-item">
            <label for="mobile" class="layui-form-label">
                <span class="x-red">*</span>手机号
            </label>
            <div class="layui-input-inline">
                <input type="text" id="mobile" name="mobile" required="" lay-verify="mobile"
                       autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">
                    11位数字
                </span>
            </div>
        </div>

        <div class="layui-form-item">
            <label for="email" class="layui-form-label">
                <span class="x-red">*</span>邮箱
            </label>
            <div class="layui-input-inline">
                <input type="text" id="email" name="email" required="" lay-verify="email"
                       autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">性别</label>
            <div class="layui-input-block">
                <input type="radio" name="sex" value="男" title="男" checked>
                <input type="radio" name="sex" value="女" title="女" >
            </div>
        </div>

        <div class="layui-form-item">
            <label for="address" class="layui-form-label">
                <span class="x-red"></span>地址
            </label>
            <div class="layui-input-inline">
                <input type="text" id="address" name="address" required="" lay-verify="address"
                       autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
            </div>
        </div>


        <h2><strong>负责餐桌</strong></h2>
        <hr />



        <div class="layui-form-item" >
            <label class="layui-form-label">负责餐桌：</label>

            <div class="layui-input-inline" style="">
            
                <foreach name="table" item="v" key="k" >
                    <p><input type="checkbox" name="table" value="{$v.id}">{$v.isbox}--{$v.table_name}</p>
               </foreach>
                
            </div>
             
        </div>




        <div id="tableAdd" style="margin-top:10px;" class="layui-form">

        </div>



        <div class="layui-form-item">
            <label for="" class="layui-form-label">
            </label>
            <button  class="layui-btn" lay-filter="add" lay-submit="">
                添加
            </button>
        </div>
    </form>
</div>
<script>
    layui.use(['form','layer'], function(){
        $ = layui.jquery;
        var form = layui.form,
            layer = layui.layer;

        //自定义验证规则
        form.verify({
            nickname: function(value){
                if(value.length < 2){
                    return '昵称至少得2个字符啊';
                }
            }
            ,mobile: [/^1(3|4|5|7|8)\d{9}$/, '请输入正确的手机号']

        });

        //监听提交
        form.on('submit(add)', function(data){

            var table_id = document.getElementsByName('table');
            var s = '';
            for (var i = 0; i < table_id.length; i++) {
                if (table_id[i].checked) {
                    s += table_id[i].value + ','
                }
            }

            // var table = $('#table option:selected').map(function(){
            //     return $(this).val();
            // }).get();


            data.field.table = s;
            $.post("{:U('Member/store')}", data.field, function(resp) {
                console.log(data.field);
                if (resp.code == 0) {
                    layer.alert("添加成功", {icon: 6},function () {
//                        // 获得frame索引
//                        var index = parent.layer.getFrameIndex(window.name);
//                        //关闭当前frame
//                        parent.layer.close(index);
                        parent.location.reload();
                    });
                } else {
                    layer.msg(resp.msg, function () { });
                }
            }, 'json')

            return false;
        });




    });
</script>

</body>

</html>